<template id="index">
    <div>
        <div class="container body" >
            <div class="form row">
                <form class="form-horizontal col-sm-offset-3 col-md-offset-3" id="login_form">
                    <h3 class="form-title">登录账号</h3>
                    <div class="col-sm-9 col-md-9">
                        <div class="form-group">
                            <i class="fa fa-user fa-lg"></i>
                            <input class="form-control required" type="text" placeholder="用户名" name="username" autofocus="autofocus" maxlength="20" v-model="lUsername"/>
                        </div>
                        <div class="form-group">
                            <i class="fa fa-lock fa-lg"></i>
                            <input class="form-control required" type="password" placeholder="密码" name="password" maxlength="8" v-model="lPassword"/>
                        </div>
                        <div class="form-group">
                            <label class="checkbox">
                                <input type="checkbox" name="remember" value="1" v-model="isExpert"/> 是否咨询师
                            </label>
                            <hr />
                            <a href="javascript:;" id="register_btn" class="">立即注册</a>
                        </div>
                        <div class="form-group">
                            <input type="button" class="btn btn-success pull-right" value="登录 " @click="doLogin"/>
                        </div>
                    </div>
                </form>
            </div>

            <div class="form row">
                <form class="form-horizontal col-sm-offset-3 col-md-offset-3" id="register_form">
                    <h3 class="form-title">注册成为用户</h3>
                    <div class="col-sm-9 col-md-9">
                        <div class="form-group">
                            <i class="fa fa-user fa-lg"></i>
                            <input class="form-control required" type="text" placeholder="用户名" name="username" autofocus="autofocus" v-model="rUsername"/>
                        </div>
                        <div class="form-group">
                            <i class="fa fa-lock fa-lg"></i>
                            <input class="form-control required" type="password" placeholder="密码" id="register_password" name="password" v-model="rPassword"/>
                        </div>
                        <div class="form-group">
                            <i class="fa fa-check fa-lg"></i>
                            <input class="form-control required" type="password" placeholder="再次确认密码" name="rpassword"/>
                        </div>
                        <div class="form-group">
                            <i class="fa fa-envelope fa-lg"></i>
                            <input class="form-control eamil" type="text" placeholder="邮箱" name="email" v-model="email"/>
                        </div>
                        <div class="form-group">
                            <input  type="button" class="btn btn-success pull-right" value="立即注册" @click="doReg()"/>
                            <input type="button" class="btn btn-info pull-left" id="back_btn" value="返回"/>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'index',
        data () {
            return {
                lUsername:"",
                lPassword:"",
                rUsername:"",
                rPassword:"",
                email:"",
                isExpert:true,
                RegUser:{},
                LogUser:{},
            }
        },
        methods:{
                doReg:function () {
                        this.RegUser.username=this.rUsername;
                        this.RegUser.password=this.rPassword;
                        this.RegUser.email=this.email;
                        console.log(this.RegUser)
                },
            doLogin:function () {
                this.LogUser.username=this.lUsername;
                this.LogUser.password=this.lPassword;
//                this.$http.get(webApi+"manager/login/"+this.LogUser.username+"/"+this.LogUser.password).then(function (data) {
//                        if(data.code==101){
//
//                        }
//                })
                cookie.set("admin",this.LogUser.username,1)
                this.$router.push('/manager');
            }

        }
    }
</script>
<style>

    .body{background: url(../../assets/4.jpg) no-repeat;background-size: cover;font-size: 16px; width: 100%;height: 100%}
    .form{background: rgba(255,255,255,0.2);width:400px;margin:100px auto;}
    #login_form{display: block;}
    #register_form{display: none;}
    .fa{display: inline-block;top: 27px;left: 6px;position: relative;color: #ccc;}
    input[type="text"],input[type="password"]{padding-left:26px;}
    .checkbox{padding-left:21px;}
    label.error{color: red;}

</style>

